<!-- 自定义卡片 -->
<template>
  <div>
    <div v-for="(item, index) of cardList" :key="index" class="card">
        <div>
            <img :src="item.imgUrl" alt="" />
        </div>
       <div class="content">
        <div class="intro">{{ item.intro }}</div>
        <div class="time">{{ item.time }}</div>
       </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    cardList: Array,
  },
  data() {
    return {};
  },
};
</script>

<style  scoped>

.card{
    display: flex;
    margin-top: 15px ;
    color: rgb(117, 116, 116);
}
.card img {
  width: 240px;
  height: 150px;
  border-radius: 10px;
}
.content{
    margin: 10px 0 10px 20px;
}
 .intro{
   font-size: 32px;
}
.time{
    text-align: right;
    font-size: 25px;
    margin-top: 5px;
}
</style>
